<template>
  <div class="empty-card flex" :style="props.customStyle">
    <img class="empty-icon" :src="props.icon" alt="" />
    <div v-if="props.desc" class="empty-desc">{{ props.desc }}</div>
  </div>
</template>
<script setup lang="ts">
import DefaultIcon from '@/assets/images/note_no_image.png'
interface EmptyCardProps {
  icon?: string
  desc?: string
  customStyle?: string
}
const props = withDefaults(defineProps<EmptyCardProps>(), {
  icon: DefaultIcon,
  desc: '',
  customStyle: '',
})
</script>
<style lang="scss" scoped>
.empty-card {
  width: 100%;
}
.empty-icon {
  height: 170px;
}
.empty-desc {
  color: #999;
  font-size: 12px;
}
</style>
